import React, { useRef, useState, useEffect, useReducer } from 'react';

import { Button, Space, Drawer, Modal } from 'dw-mx';
import { Dialog } from 'dw-mx-extend';
import { request } from 'dw-mx-request';

import PDViewer from 'dw-mx-sew-plugin-sefdsu';
import UTViewer from 'dw-mx-sew-plugin-sefdsu';
import { TaskInstance, InitProcessVars } from 'dw-mx-sew/lib/SEWEngineInterface';
import { SewLanePDViewer } from 'dw-mx-sew-plugin-sefdsu';
import path from 'path';
export interface TiItem {
    piid: string;
    ti: TaskInstance;
}

export interface PropsListItem {
    pdid: string;
    userid: string;
    initProcessVars: InitProcessVars;
    ignoreWarning: boolean;
    ignoreAuth: boolean;
}

export default function SewDemo() {
    const dialogRef = useRef<Dialog>();

    const [propsList, setPropsList] = useState<Array<PropsListItem>>([]);
    /**
     * 开启流程
     */
    const doNewProcess = async () => {
        await dialogRef.current.openDialog(PDViewer, {
            title: '开启流程',
            width: '50%',
            height: '50%',
            props: {
                pdid: 'config_eco',
                userid: 'ADMIN',
                initProcessVars: {
                    biz: '001',
                    bljgid: '001',
                    ecolabel: 'some-label',
                    needconfig: true,
                },
            },
        });
    };
    /**
     * 办理流程
     */
    const completeTask = async () => {
        await dialogRef.current.openDialog(UTViewer, {
            title: '办理流程',
            width: '50%',
            height: '50%',
            props: {
                ti: {
                    piid: 'pdid-1',
                    eid: '',
                    tid: 'tid-1',
                    tname: '',
                    tctime: '',
                    assigneename: '',
                    description: '',
                    adid: '',
                    bljgid: '',
                },
            },
        });
    };

    /**
     * 签领任务
     */
    const claimTask = async () => {
        const ret = await request('/mx/SEWEngine/claimTask', {
            tid: 'tid-1',
            userid: 'ADMIN',
        });
    };

    /**
     * 退签任务
     */
    const unClaimTask = async () => {
        const ret = await request('/mx/SEWEngine/unClaimTask', {
            tid: 'tid-1',
        });
        alert(ret.result_message);
    };
    const unAuthorProcess = async () => {
        await dialogRef.current.openDialog(PDViewer, {
            title: '无权限开启流程',
            width: '50%',
            height: '50%',
            props: {
                pdid: 'config_eco',
                userid: 'ADMIN',
                initProcessVars: {
                    biz: '001',
                    bljgid: '001',
                    ecolabel: 'some-label',
                },
            },
        });
    };
    const newProcessWarning = async () => {
        await dialogRef.current.openDialog(PDViewer, {
            title: '一主体多流程警告',
            width: '50%',
            props: {
                pdid: 'config_eco',
                userid: 'ADMIN',
                initProcessVars: {
                    biz: '001',
                    bljgid: '001',
                    ecolabel: 'some-label',
                    needconfig: true,
                },
            },
        });
    };
    const newProcessForbidden = async () => {
        propsList.push({
            pdid: 'config_eco',
            userid: 'ADMIN',
            initProcessVars: {
                biz: '001',
                bljgid: '001',
                ecolabel: 'some-label',
                needconfig: true,
            },
            ignoreWarning: false,
            ignoreAuth: false,
        });
    };

    const versionsProcess = () => {
        propsList.push({
            pdid: 'config_eco',
            userid: 'ADMIN',
            initProcessVars: {
                biz: '001',
                bljgid: '001',
                ecolabel: 'some-label',
                needconfig: true,
            },
            ignoreWarning: false,
            ignoreAuth: true,
        });
        setPropsList(propsList.slice());
    };
    
    return (
        <div>
            <h2>SEW Engine</h2>
            <Space>
                <Button onClick={doNewProcess} title={'doNewProcess'}>
                    开启流程
                </Button>
                <Button onClick={completeTask} title={'completeTask'}>
                    办理流程
                </Button>
                <Button onClick={claimTask} title={'claimTask'}>
                    签领任务
                </Button>
                <Button onClick={unClaimTask} title={'unClaimTask'}>
                    退签任务
                </Button>
                <Button onClick={unAuthorProcess} title={'unAuthorProcess'}>
                    无权限开启流程
                </Button>
                <Button onClick={newProcessWarning}>一主体多流程警告</Button>
                <Button onClick={newProcessForbidden}>一主体多流程禁止</Button>
                <Button onClick={versionsProcess} title={'versionsProcess'}>
                    多版本流程
                </Button>
            </Space>

            {propsList.length > 0 ? (
                propsList.map((item, index) => {
                    return <SewLanePDViewer pdid={item.pdid} userid={item.userid} initProcessVars={item.initProcessVars} ignoreAuth={item.ignoreAuth} ignoreWarning={item.ignoreWarning}></SewLanePDViewer>;
                })
            ) : (
                <div></div>
            )}
        </div>
    );
}
